import React from 'react'

interface BarrageInputProps {
  value: string
  onChange: (value: string) => void
  onSend: () => void
  disabled?: boolean
}

/**
 * 弹幕输入组件
 */
export const BarrageInput: React.FC<BarrageInputProps> = ({
  value,
  onChange,
  onSend,
  disabled = false
}) => {
  const handleKeyPress = (e: React.KeyboardEvent) => {
    if (e.key === 'Enter' && !disabled) {
      onSend()
    }
  }

  return (
    <div className="input-section">
      <input
        type="text"
        value={value}
        onChange={(e) => onChange(e.target.value)}
        onKeyPress={handleKeyPress}
        placeholder="输入弹幕内容..."
        className="barrage-input"
        disabled={disabled}
      />
      <button 
        onClick={onSend} 
        className="send-btn"
        disabled={!value.trim() || disabled}
      >
        发送
      </button>
    </div>
  )
}

